<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
    <h:head>
        <c:set var="webRoot" value="#{facesContext.externalContext.requestContextPath}"/> 
        <c:set var="jsfRoot" value="#{facesContext.viewRoot.viewId}"/>
        <h:outputStylesheet name="DataTables-1.9.4/media/css/jquery.dataTables.css"/>
        <h:outputScript name="DataTables-1.9.4/media/js/jquery.js"/>
        <h:outputScript name="init.js" />
        <h:outputScript name="DataTables-1.9.4/media/js/jquery.dataTables.js"/>
        
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        Hello from Facelets
        <fieldset>
            <legend>web root</legend>
            <h:outputLabel id="webRootLabel" value="#{webRoot}"/>
            <h:outputLabel id="jsfRootLabel" value="#{jsfRoot}"/>
            <legend> Team </legend>
            <h:form>
                Press button to get teams <br/>
                Season : <h:inputText value="#{crowler.season}"/>
                <h:commandButton value="query Teams"  
                                 action="#{crowler.queryTeams()}"/>
            </h:form>
            <f:view>
                <h:form>
                    <h1><h:outputText value="List"/></h1>
                    <h:dataTable id="teamTable" value="#{crowler.teams}" var="item">
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Id"/>
                            </f:facet>
                            <h:outputText value="#{item.id}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Hometown"/>
                            </f:facet>
                            <h:outputText value="#{item.hometown}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Mascot"/>
                            </f:facet>
                            <h:outputText value="#{item.mascot}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Key"/>
                            </f:facet>
                            <h:outputText value="#{item.key}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Fullname"/>
                            </f:facet>
                            <h:outputText value="#{item.fullname}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Conference"/>
                            </f:facet>
                            <h:outputText value="#{item.conference}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Division"/>
                            </f:facet>
                            <h:outputText value="#{item.division}"/>
                        </h:column>
                    </h:dataTable>
                </h:form>
            </f:view>


            <legend> AllPlayers </legend>
            <h:form>
                Press button to get all players <br/>
                <h:commandButton value="query Players"  
                                 action="#{crowler.queryAllPlayers()}"/>
            </h:form>
            
            <f:view>
                <h:form>
                    <h:commandButton value="put players into the DB"  
                                 action="#{crowler.putPlayersIntoDB()}"/>
                    <h1><h:outputText value="List"/></h1>
                    <h:dataTable value="#{crowler.players}" var="item">
                        <h:column class="columnA">
                            <f:facet name="header">
                                <h:outputText value="Id"/>
                            </f:facet>
                            <h:outputText value="#{item.id}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="FirstName"/>
                            </f:facet>
                            <h:outputText value="#{item.firstName}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="LastName"/>
                            </f:facet>
                            <h:outputText value="#{item.lastName}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Position"/>
                            </f:facet>
                            <h:outputText value="#{item.position}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Number"/>
                            </f:facet>
                            <h:outputText value="#{item.number}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Status"/>
                            </f:facet>
                            <h:outputText value="#{item.status}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Height"/>
                            </f:facet>
                            <h:outputText value="#{item.height}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Weight"/>
                            </f:facet>
                            <h:outputText value="#{item.weight}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Age"/>
                            </f:facet>
                            <h:outputText value="#{item.age}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="BirthDate"/>
                            </f:facet>
                            <h:outputText value="#{item.birthDate}">
                                <f:convertDateTime pattern="MM/dd/yyyy" />
                            </h:outputText>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="College"/>
                            </f:facet>
                            <h:outputText value="#{item.college}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="ExperienceYears"/>
                            </f:facet>
                            <h:outputText value="#{item.experienceYears}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="HighSchool"/>
                            </f:facet>
                            <h:outputText value="#{item.highSchool}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="PhotoURL"/>
                            </f:facet>
                            <h:outputText value="#{item.photoURL}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Active"/>
                            </f:facet>
                            <h:outputText value="#{item.active}"/>
                        </h:column>
                        <h:column>
                            <f:facet name="header">
                                <h:outputText value="Byeweek"/>
                            </f:facet>
                            <h:outputText value="#{item.byeweek}"/>
                        </h:column>
                    </h:dataTable>
                </h:form>
            </f:view>
            
            
            <legend> AllPlayers Season Stats </legend>
            <h:form>
                Press button to get all players season stat <br/>
                <h:commandButton value="query Players"  
                                 action="#{crowler.queryAllPlayersSeasonStat()}"/>
            </h:form>

        </fieldset>
    </h:body>
</html>
